<template>
  <div class="baseInfo_box">
    <Tabs value="name1" @on-click="magnifyImgUri=null">
      <TabPane class="baseInfo_box_item" v-bind:label="$t('m.gèrénxìnxī')" name="name1">
        <div class="list js-identify-list identify_person_list" style="height: 700px !important;overflow: auto;">
          <div class="baseInfo_box_item_box">
            <h4>{{$t('m.gèrénxìnxī')}}</h4>
            <span class="first" v-if="baseInfoUserData.loanCount==0">{{$t('m.shǒucìjièkuǎn')}}</span>
            <span class="first" v-else>{{$t('m.Ngàymai')}}</span>
            <i class="Level" v-if="baseInfoUserData.levelName">{{baseInfoUserData.levelName}}</i>
            <ul>
              <li><span>{{$t('m.xìngshì')}}：</span>{{baseInfoUserData.fullName}}</li>
              <li><span>{{$t('m.xingbie')}}：</span>{{baseInfoUserData.gender}}</li>
              <li><span>{{$t('m.shengri')}}：</span>{{baseInfoUserData.birthday}}</li>
              <li v-if="countryName=='PHH'"><span>{{$t('m.zhengjianleixing')}}：</span><Tooltip max-width="600" :content="baseInfoUserData.credentialType" placement="top"> <i> {{baseInfoUserData.credentialType}}</i></Tooltip> </li>
              <li><span>{{$t('m.in')}}：</span>{{baseInfoUserData.idNumber}}&nbsp;<span v-if="baseInfoUserData.idNumberCount >1" style="color: red;">{{$t('m.gōngyòngrén')}}</span> </li>
              <li><span>{{$t('m.phone')}}：</span>{{baseInfoUserData.phone}}</li>
              <li><span>{{$t('m.diànzǐyóujiàn')}}：</span>{{baseInfoUserData.emailNum}}</li>
              <li><span>{{$t('m.hE')}}：</span>{{baseInfoUserData.educationLevel}}</li>
              <li><span>{{$t('m.ms')}}：</span>{{baseInfoUserData.maritalStatus}}</li>
              <li><span>{{$t('m.haizishuliang')}}：</span>{{baseInfoUserData.childrenNumber}}</li>
              <li><span>{{$t('m.jiekuanfangshi')}}：</span>{{baseInfoUserData.payChannelName}}</li>
              <div class="baseInfo_box_item_box_centre">
                <li><span>{{$t('m.qushengshi')}}：</span> <Tooltip  max-width="600" :content="baseInfoUserData.address" placement="top"> <p> {{baseInfoUserData.address}}</p></Tooltip></li>
                <li><span>{{$t('m.nowAddTime')}}：</span>{{baseInfoUserData.residenceDuration}}</li>
                <li><span>{{$t('m.jūzhùxiángxìdìzhǐ')}}：</span><Tooltip max-width="600" :content="baseInfoUserData.addressDetail" placement="top"> <i> {{baseInfoUserData.addressDetail}}</i></Tooltip> </li>
              </div>

              <li><span>{{$t('m.zhíyè')}}：</span>{{baseInfoUserData.workCareer}}</li>
              <li><span>{{$t('m.yuèshōurù')}}：</span>{{baseInfoUserData.monthlyIncome}}</li>
              <li><span>{{$t('m.gōngzuòniánxiàn')}}：</span>{{baseInfoUserData.workDuration}}</li>
              <li><span>{{$t('m.gōngsīmíngchēng')}}：</span><Tooltip max-width="600" :content="baseInfoUserData.companyName" placement="top"> <i> {{baseInfoUserData.companyName}}</i></Tooltip> </li>
              <li><span>{{$t('m.gōngzuòshěngshìqū')}}：</span><Tooltip max-width="600" :content="baseInfoUserData.workAddress" placement="top"> <i> {{baseInfoUserData.workAddress}}</i></Tooltip> </li>
              <li><span>{{$t('m.gōngzuòxiángxìdìzhǐ')}}：</span><Tooltip max-width="600" :content="baseInfoUserData.workAddressDetail" placement="top"> <i> {{baseInfoUserData.workAddressDetail}}</i></Tooltip> </li>
              <li><span>{{$t('m.gōngsīdiànhuà')}}：</span>{{baseInfoUserData.officePhone}}</li>
              <div class="baseInfo_box_item_box_border"></div>
              <li><span>
                  <Icon type="ios-chatbubbles" />Line：</span>{{baseInfoUserData.socialLine}}</li>
              <li><span>
                  <Icon type="logo-facebook" />Facebook：</span>{{baseInfoUserData.socialFacebook}}</li>
              <li><span>Zalo：</span>{{baseInfoUserData.socialZalo}}</li>
              <li><span>
                  <Icon type="ios-call" />Skype：</span>{{baseInfoUserData.socialSkype}}</li>
              <li><span>
                  <Icon type="logo-instagram" />Instagram：</span>{{baseInfoUserData.socialIns}}</li>
              <li><span>Viber：</span>{{baseInfoUserData.socialViber}}</li>
            </ul>

          </div>

          <div class="baseInfo_box_item_box">
            <h4>{{$t('m.huotixinxi')}}</h4>
            <ul>
              <li><span>{{$t('m.renxiangpipeidu')}}：</span>{{baseInfoUserData.faceComparisonSimilarity}}</li>
              <li><span>{{$t('m.renxiangsousuojieguo')}}：</span>{{baseInfoUserData.faceSearchSimilarity}}</li>
            </ul>
          </div>
          <div class="baseInfo_box_item_box">
            <h4>{{$t('m.picInfo')}}</h4>
            <div v-if="!magnifyImgUri" class="list picInfo" id="identify_photo_list">
              <li class="picInfoLi">
                <h3>{{ $t("m.zhengjianzhengmian") }} </h3>
                <a @click="magnifyImgEvent(baseInfoUserData.idcardFrontUrl)" target="_blank"><img id="img1" v-if="baseInfoUserData.idcardFrontUrl" :src="baseInfoUserData.idcardFrontUrl"><span v-else>{{$t('m.zhànshíwútúpiàn')}}</span></a>

                <div class="baseInfoImgBox">
                  <Upload ref="upload" :show-upload-list="false" :format="['jpg', 'jpeg', 'png']" :before-upload="baseInfoUploadEventData" accept="image/jpeg,image/png" action="" class="baseInfoImgBoxUpload">
                    <Button size="small" icon="ios-cloud-upload-outline" :loading="btnLoading" @click="baseInfoUploadEventParam(1)" style="width:100px;font-size: 20px;"></Button>
                  </Upload>
                  <div class="baseInfoImgTitleBox">
                    <Button size="small" icon="ios-refresh" @click="zhuan('img1')" style="width:100px;font-size: 20px;"></Button>
                  </div>
                </div>
              </li>
              <li class="picInfoLi" v-if="countryName=='VN'">
                <h3>{{ $t("m.zhèngjiànfǎnmiàn") }} </h3>
                <a @click="magnifyImgEvent(baseInfoUserData.idcardBackUrl)" target="_blank"><img id="img3" v-if="baseInfoUserData.idcardBackUrl" :src="baseInfoUserData.idcardBackUrl"><span v-else>{{$t('m.zhànshíwútúpiàn')}}</span></a>

                <div class="baseInfoImgBox">
                  <Upload ref="upload" :show-upload-list="false" :format="['jpg', 'jpeg', 'png']" :before-upload="baseInfoUploadEventData" accept="image/jpeg,image/png" action="" class="baseInfoImgBoxUpload">
                    <Button size="small" icon="ios-cloud-upload-outline" :loading="btnLoading" @click="baseInfoUploadEventParam(2)" style="width:100px;font-size: 20px;"></Button>
                  </Upload>
                  <div class="baseInfoImgTitleBox">
                    <Button size="small" icon="ios-refresh" @click="zhuan('img3')" style="width:100px;font-size: 20px;"></Button>
                  </div>
                </div>
              </li>
              <li class="picInfoLi">
                <h3>{{ $t("m.zhuapaizhao") }} </h3>
                <a @click="magnifyImgEvent(baseInfoUserData.faceSnapshotUrl)" target="_blank"><img id="img2" v-if="baseInfoUserData.faceSnapshotUrl" :src="baseInfoUserData.faceSnapshotUrl"><span v-else>{{$t('m.zhànshíwútúpiàn')}}</span></a>

                <div class="baseInfoImgBox">
                  <Upload ref="upload" :show-upload-list="false" :format="['jpg', 'jpeg', 'png']" :before-upload="baseInfoUploadEventData" accept="image/jpeg,image/png" action="" class="baseInfoImgBoxUpload">
                    <Button size="small" icon="ios-cloud-upload-outline" :loading="btnLoading" @click="baseInfoUploadEventParam(4)" style="width:100px;font-size: 20px;"></Button>
                  </Upload>
                  <div class="baseInfoImgTitleBox">
                    <Button size="small" icon="ios-refresh" @click="zhuan('img2')" style="width:100px;font-size: 20px;"></Button>
                  </div>
                </div>
              </li>

              <li class="picInfoLi">
                <h3>{{ $t("m.gōngzuòzhàopiàn") }} </h3>
                <a @click="magnifyImgEvent(baseInfoUserData.workEvidenceUrl)" target="_blank"><img id="img5" v-if="baseInfoUserData.workEvidenceUrl" :src="baseInfoUserData.workEvidenceUrl"><span v-else>{{$t('m.zhànshíwútúpiàn')}}</span></a>

                <div class="baseInfoImgBox">
                  <Upload ref="upload" :show-upload-list="false" :format="['jpg', 'jpeg', 'png']" :before-upload="baseInfoUploadEventData" accept="image/jpeg,image/png" action="" class="baseInfoImgBoxUpload">
                    <Button size="small" icon="ios-cloud-upload-outline" :loading="btnLoading" @click="baseInfoUploadEventParam(3)" style="width:100px;font-size: 20px;"></Button>
                  </Upload>
                  <div class="baseInfoImgTitleBox">
                    <Button size="small" icon="ios-refresh" @click="zhuan('img5')" style="width:100px;font-size: 20px;"></Button>
                  </div>
                </div>
              </li>
            </div>
            <div v-else class="identify_photo_list_img">
              <span>{{$t('m.xuánzhuǎn')}}
                <Icon type="ios-refresh" size="40" @click="zhuan('img4')" f></Icon>
              </span>
              <div style="width: auto; height: auto;overflow: hidden;">
                <img id="img4" style="width:100%;" :src="magnifyImgUri" alt="" @click="noMagnifyImgEvent">
              </div>
            </div>

          </div>
          <div class="baseInfo_box_item_box">
            <h4>{{$t('m.bankInfo')}}</h4>
            <table class="table table-hover table-condensed">
              <thead>
                <tr>
                  <td>{{$t('m.Bname')}}</td>
                  <td>{{$t('m.BcardN')}}</td>
                  <td>{{$t('m.creatBN')}}</td>
                  <td>{{$t('m.banktype')}}</td>
                </tr>
              </thead>
              <tbody>
                <tr v-for="item in baseInfoBankcardData">
                  <td>{{item.bankName}}</td>
                  <td>{{ item.accountNo}}</td>
                  <td>{{item.accountName}}</td>
                  <td>{{accountTypeArray[item.accountType]}}</td>
                </tr>
              </tbody>
            </table>
          </div>
          <div class="baseInfo_box_item_box">
            <h4>{{$t('m.AR')}}</h4>
            <table class="table table-hover table-condensed">
              <thead>
                <tr>
                  <td>{{$t('m.liánxìrénlèixíng')}}</td>
                  <td>{{$t('m.xìngmíng')}}</td>
                  <td>{{$t('m.guānxì')}}</td>
                  <td>{{$t('m.shǒujīhào')}}</td>
                  <td>{{$t('m.shìfǒuzàitōngxùnlùzhōng')}}</td>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td>{{$t('m.ralatives')}}</td>
                  <td>{{ baseInfoUserData.contactRelativeFullname}}</td>
                  <td>{{RelationshipObj[baseInfoUserData.contactRelativeRelationship]}}</td>
                  <td>{{baseInfoUserData.contactRelativePhone}}</td>
                  <td><span v-if="baseInfoUserData.contactRelativeInPhonebook">{{$t('m.yes')}}</span><span v-else>{{$t('m.no')}}</span> </td>
                </tr>
                <tr>
                  <td>{{$t('m.frien')}}</td>
                  <td>{{ baseInfoUserData.contactFriendFullname}}</td>
                  <td>{{RelationshipObj[baseInfoUserData.contactFriendRelationship]}}</td>
                  <td>{{baseInfoUserData.contactFriendPhone}}</td>
                  <td><span v-if="baseInfoUserData.contactRelativeInPhonebook">{{$t('m.yes')}}</span><span v-else>{{$t('m.no')}}</span> </td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </TabPane>

      <TabPane class="baseInfo_box_item" v-bind:label="$t('m.CallLog')" name="name2">
        <div class="list js-identify-list" style="height: 700px !important;overflow: auto;">
          <div class="baseInfo_box_item_box">
            <div class="baseInfo_box_item_top">
              <span>{{$t('m.Tōngxùnlùzǒngshù')}}：</span><i>{{baseInfoPhonebookData.totalNum}}</i>
              <span>{{$t('m.yǒuxiàoshù')}}：</span><i>{{baseInfoPhonebookData.validNum}}</i>
              <span>{{$t('m.chóngfùshù')}}：</span><i>{{baseInfoPhonebookData.repeatNum}}</i>
            </div>
            <table class="table table-hover table-condensed">
              <thead>
                <tr>
                  <td>{{$t('m.userName')}}</td>
                  <td>{{$t('m.phone')}}</td>
                </tr>
              </thead>
              <tr v-for="item in baseInfoPhonebookData.phonebooks">
                <td>{{item.name}}</td>
                <td>{{item.phone}}</td>
              </tr>
            </table>

          </div>
        </div>
      </TabPane>

      <TabPane class="baseInfo_box_item" v-bind:label="$t('m.fengkongxinxi')" name="name3">
        <div class="list js-identify-list">
          <div class="baseInfo_box_item_box">
            <h4>{{$t('m.fēngkòngmíngdānmíngxì')}}</h4>
            <div class="baseInfo_box_item_risk" v-for="item in baseInfoRiskResultsData">
              <em></em>
              <div class="risk_title">{{riskTypeNameObj[item.riskType]}}</div>
              <span>
                <i :class="'risk_type'+item.riskResult">{{riskResultNameObj[item.riskResult]}}</i>
              </span>
            </div>

          </div>
        </div>
      </TabPane>

      <TabPane class="baseInfo_box_item" v-bind:label="$t('m.lìshǐdìngdānxìnxī')" name="name4">
        <div class="list js-identify-list" id="identify_relation_list">
          <div class="baseInfo_box_item_box">
            <table class="table table-hover table-condensed">
              <thead>
                <tr>
                  <td>{{$t('m.applyTime')}}</td>
                  <td>{{$t('m.jièkuǎnjīné')}}</td>
                  <td>{{$t('m.Fàngkuǎnjīné')}}</td>
                  <td>{{$t('m.fàngkuǎnshíjiān')}}</td>
                  <td>{{$t('m.shěnpījiéguǒ')}}</td>
                  <td>{{$t('m.repayCreat')}}</td>
                  <td>{{$t('m.overdueDay')}}</td>
                  <td>{{$t('m.yīnghuánkuǎnshíjiān')}}</td>
                  <td>{{$t('m.shíjìhuánkuǎnshíjiān')}}</td>
                  <td>{{$t('m.shíjìhuánkuǎnjīné')}}</td>
                </tr>
              </thead>
              <tr v-for="item in baseInfoHistorysListData">
                <td>{{item.applyTime}}</td>
                <td>{{item.loanAmount}}</td>
                <td>{{item.payAmount}}</td>
                <td>{{item.timePay}}</td>
                <td>{{auditStatusObj[item.auditStatus]}}</td>
                <td>{{loanStatusObj[item.loanStatus]}}</td>
                <td>{{item.overdueDays}}</td>
                <td>{{item.dueDate}}</td>
                <td>{{item.timeRepay}}</td>
                <td>{{item.repaidAmount}}</td>
              </tr>
            </table>
          </div>

          <div class="baseInfo_box_item_box">
            <h4>{{$t('m.kèhùbiāoqiān')}}</h4>

            <table class="table table-hover table-condensed">
              <thead>
                <tr>
                  <td>{{ $t("m.biāoqiān") }}</td>
                  <td>{{ $t("m.gēngxīnshíjiān") }}</td>
                </tr>
              </thead>
              <tbody>
                <tr v-for="item in baseInfoLabelData">
                  <td>{{ item.labelName }}</td>
                  <td>{{ item.utime }}</td>
                </tr>
              </tbody>
            </table>
          </div>

          <div class="baseInfo_box_item_box">
            <h4>{{$t('m.cuīshōurìzhì')}}</h4>
            <table class="table table-hover table-condensed">
              <thead>
                <tr>
                  <td>{{ $t("m.dìngdānbiānhào") }}</td>
                  <td>{{ $t("m.bèizhù") }}</td>
                  <td>{{ $t("m.cuīshōuyuán") }}</td>
                  <td>{{ $t("m.gēngxīnshíjiān") }}</td>
                </tr>
              </thead>
              <tbody>
                <tr v-for="item in baseInfoCollectionData">
                  <td>{{ item.orderGid }}</td>
                  <td>{{ item.remark }}</td>
                  <td>{{ item.operator }}</td>
                  <td>{{ item.utime }}</td>
                </tr>
              </tbody>
            </table>
          </div>
          <div class="baseInfo_box_item_box">
            <h4>{{$t('m.shěnpīliúzhuànjìlù')}}</h4>
            <table class="table table-hover table-condensed">
              <thead>
                <tr>
                  <td>{{ $t("m.chuàngjiànshíjiān") }}</td>
                  <td>{{ $t("m.dìngdānbiānhào") }}</td>
                  <!-- <td>{{ $t("m.bèizhù") }}</td> -->
                  <td>{{ $t("m.shěnpīrén") }}</td>
                </tr>
              </thead>
              <tbody>
                <tr v-for="item in baseInfoApprovalData">
                  <td>{{ item.ctime }}</td>
                  <td>{{ item.orderGid }}</td>
                  <!-- <td>{{ item.remark }}</td> -->
                  <td>{{ item.checker }}</td>
                </tr>
              </tbody>
            </table>
          </div>

        </div>
      </TabPane>

      <TabPane class="baseInfo_box_item" v-bind:label="$t('m.yònghùbèizhù')" name="name5">
        <form role="form">

          <div class="baseInfo_box_item_box">
            <div class="form-group">
              <i-input type="textarea" v-model="upremark" v-bind:placeholder="$t('m.qǐngshūrù')+$t('m.bznr')"></i-input>

            </div>
          </div>
          <div class="form-group" style="text-align: center">
            <input style="width: 20%" type="reset" :value="this.$t('m.recycle')" class="btn btn-danger">
            <Button style="width: 20%;margin-left: 20px;" :loading="btnLoading" @click="addClick()">{{$t('m.add')}}</Button>
          </div>
        </form>
        <div class="baseInfo_box_item_box">
          <table class="table table-hover table-condensed" border>
            <thead>
              <tr>
                <td>{{$t('m.bzsj')}}</td>
                <td>{{$t('m.bzry')+$t('m.role')}}</td>
                <td>{{$t('m.bzry')}}</td>
                <td>{{$t('m.bznr')}}</td>
              </tr>
            </thead>
            <tr v-for="item in baseInfoUserData.remarkInfo" class="identifyList" :dataid="item.id">
              <td>{{item.ctime}}</td>
              <td>{{item.operator}}</td>
              <td>{{item.operator}}</td>
              <td>{{item.remark}}</td>
            </tr>
          </table>

        </div>
      </TabPane>

      <TabPane class="baseInfo_box_item" v-bind:label="$t('m.shàngchuánzhàopiàn')" name="name6">
        <div class="list js-identify-list" id="identify_relation_list">

          <div class="baseInfo_box_item_box">
            <h4>{{$t('m.picInfo')}}（{{$t('m.imgItem')}}）</h4>
            <div>
              <Upload ref="upload" :show-upload-list="false" :format="['jpg', 'jpeg', 'png']" :before-upload="baseInfoUploadEventData" accept="image/jpeg,image/png" action="">
                <Button :loading="btnLoading" @click="baseInfoUploadEventParam(10)" class="baseInfo_box_item_box_upLoad_button">{{$t('m.shàngchuánzhàopiàn')}}+</Button>
              </Upload>
            </div>
          </div>
          <div class="baseInfo_box_item_box">
            <h4>{{$t('m.picInfo')}}</h4>
            <div v-if="!magnifyImgUri" class="list picInfo" id="identify_photo_list">
              <li class="picInfoLi" v-for="(item,index) in baseInfoTabUpLoadListData">
                <a @click="magnifyImgEvent(item.imgUrl)" target="_blank"><img :id="'upImg'+index" v-if="item.imgUrl" :src="item.imgUrl"><span v-else>{{$t('m.zhànshíwútúpiàn')}}</span></a>
                <div class="baseInfoImgBox">
                  <div class="baseInfoImgTitleBox">
                    <Button size="small" icon="ios-refresh" @click="zhuan('upImg'+index)" style="width:100px;font-size: 20px;"></Button>
                  </div>
                </div>
              </li>

            </div>
            <div v-else class="identify_photo_list_img">
              <span>{{$t('m.xuánzhuǎn')}}
                <Icon type="ios-refresh" size="40" @click="zhuan('upImg')" f></Icon>
              </span>
              <div style="width: auto; height: auto;overflow: hidden;">
                <img id="upImg" style="width:100%;" :src="magnifyImgUri" alt="" @click="noMagnifyImgEvent">
              </div>
            </div>

          </div>
        </div>
      </TabPane>

    </Tabs>
  </div>
</template>

<script>
export default {
  name: 'baseInfo',
  data () {
    return {      
      countryName:'',
      baseInfoBankcardData: [],
      accountTypeArray: {
        '0': this.$t('m.zhànghào'),
        '1': this.$t('m.kǎhào')
      },
      baseInfoUserData: [],
      baseInfoPhonebookData: {},
      UserApprovalData: [],
      UserCollectionData: [],
      UserLabelData: [],
      baseInfoCollectionData: [],
      baseInfoApprovalData: [],
      baseInfoLabelData: [],
      Ewallet: [],
      magnifyImgUri: '',
      deg: 0,
      pawnType: '',
      upremark: '',
      btnLoading: false,
      gzxxImgUri: '',
      magnifyImgUrigzxx: '',
      baseInfoFiletype: '',
      baseInfoHistorysListData: [],
      baseInfoRiskResultsData: [],
      baseInfoTabUpLoadListData: [],
      RelationshipObj: {
        'father': this.$t('m.fùqīn'),
        'mother': this.$t('m.mǔqīn'),
        'wife': this.$t('m.qīzi'),
        'husband': this.$t('m.zhàngfū'),
        'daughter': this.$t('m.nǚér'),
        'son': this.$t('m.érzi'),
        'friend': this.$t('m.péngyǒu'),
        'colleague': this.$t('m.tóngshì'),
        'classmate': this.$t('m.tóngxué'),
      },
      riskTypeNameObj: {
        'ADVANCE_RISK_BLACK_LIST': this.$t('m.MìngzhòngADVANCEhēimíngdān'),
        'FISH_RISK_HIT': this.$t('m.xiaoheiyufengkongjieguo'),
        'STARS_RISK_BLACK_LIST': this.$t('m.xīnghéhēimíngdān'),
        'STARS_FACE_RISK_BLACK_LIST': this.$t('m.xīnghérénliǎnhēimíngdān'),
        'ADVANCE_FACEBOOK_HIT': this.$t('m.yuènánfacebookzhànghào'),
        'GOLD_FINANCE_HIT': this.$t('m.huángjīncáiwù'),
        'LOCAL_RISK_BLACK_LIST': 'ADVANCE' + this.$t('m.black'),
        'ADVANCE_FACE_RISK_BLACK_LIST': this.$t('m.běndìhēimíngdān'), // 人脸黑名单
        'GOLD_FINANCE_ID_HIT': this.$t('m.shēnfènzhènghào'),  //身份证
        'GOLD_FINANCE_MOB_HIT': this.$t('m.shǒujīhào'),  //手机号
        'GOLD_FINANCE_AAID_HIT': this.$t('m.ānzhuōshèbèiAdvertisingID'), // 安卓id
        'GOLD_FINANCE_IDFA_HIT': this.$t('m.píngguǒshèbèiIDFA'), // 苹果id
        'GOLD_FINANCE_EMAIL_HIT': this.$t('m.yóuxiāngdìzhǐ'), // 邮箱id
        'GOLD_FINANCE_IP_HIT': this.$t('m.IPdìzhǐ'), // ip地址
        'GOLD_FINANCE_WIFIMAC_HIT': this.$t('m.WIFIMacdìzhǐ'), // wifi地址
      },
      riskResultNameObj: {
        '0': this.$t('m.wèimìngzhòng'),
        '1': this.$t('m.mìngzhòng'),
        '2': this.$t('m.gāofēngxiǎn'),
        '3': this.$t('m.zhòngfēngxiǎn'),
        '4': this.$t('m.dīfēngxiǎn'),
        '5': this.$t('m.yísìzhōngjiè'),
        '6': this.$t('m.kāitōngzhànghào'),
        '7': this.$t('m.wèikāitōngzhànghào'),
        '8': this.$t('m.zhànghàodòngjiéyìcháng')
      },
      auditStatusObj: {
        'checking_machine': this.$t('m.checking_machine'),
        'reject_machine': this.$t('m.jīshěnjùjué'),
        'waiting_to_pick': this.$t('m.waiting_to_pick'),
        'checking_first': this.$t('m.checking_first'),
        'reject_first': this.$t('m.reject_first'),
        'hanging_first': this.$t('m.hanging_first'),
        'pass_first': this.$t('m.pass_first'),
        'checking_final': this.$t('m.checking_final'),
        'pass': this.$t('m.pass'),
        'reject_final': this.$t('m.reject_final'),
      },
      loanStatusObj: {
        'paying': this.$t('m.paying'),
        'pay_fail': this.$t('m.pay_fail'),
        'pay_cancel': this.$t('m.pay_cancel'),
        'paid': this.$t('m.paid'),
        'pre_repaid': this.$t('m.pre_repaid'),
        'repaid': this.$t('m.repaid'),
      }
    }
  },
  components: {},
  props: {
    userId: {
      type: Number,
      default: null
    },
    orderGid: {
      default: null
    },
    baseType: {

      default: null
    }
  },
  watch: {},
  methods: {
    // 上传文件类型
    baseInfoUploadEventParam (val) {
      this.baseInfoFiletype = val
    },
    // 上传文件本地方法
    baseInfoUploadEventData (file) {

      const reg = /^(image\/bmp|image\/gif|image\/jpeg|image\/png|image\/tiff)$/i;
      const limit5 = file.size / 1024 / 1024 < 1;
      // const check = this.uploadList.length < 1;

      if (!reg.test(file.type)) {
        this.$Message.error(this.$t('m.zhǐnéngshàngchuánjpgjpegpnggéshìdetúpiàn'));
        return false;
      }
      if (!limit5) {
        this.$Message.error(this.$t('m.shàngchuándetúpiànbùnéngchāoguò1MB'));
        return false;
      }
      const reader = new FileReader();
      reader.readAsDataURL(file);
      reader.onload = (e) => {
        let result = e.target.result;
        if (this.baseInfoFiletype == 10) {
          this.baseInfoTabUpload(result)
        } else {
          this.baseInfoUploadEvent(result)

        }
      }
      reader.onerror = (e) => {
        this.$Message.error('base64 Error');
      }
      return false;
    },
    // Tab上传图片上线方法
    baseInfoTabUpload (fileData) {
      this.$http.post('/api/laocai/user/miscResources', {
        userId: this.userId,
        info: fileData,
        remark: this.$t('m.bèizhùzhàopiàn'),
      }).then((res) => {
        this.btnLoading = false
        if (res.body.code == 0) {
          // debugger
          this.baseInfoUser()
          this.baseInfoUpImages()
        }
        this.$Message.success(this.$t('m.shàngchuánzhàopiàn') + this.$t('m.qǐngqiú') + this.$t('m.errorCode' + res.body.code));
      })
    },
    // 基本信息上传图片上线方法
    baseInfoUploadEvent (fileData) {
      this.$http.post('/api/laocai/check/uploadCertificate', {
        userId: this.userId,
        certificateType: this.baseInfoFiletype,
        info: fileData,
        remark: ''
      }).then((res) => {
        this.btnLoading = false
        if (res.body.code == 0) {
          this.baseInfoUser()
        }
        this.$Message.success(this.$t('m.scImg') + this.$t('m.qǐngqiú') + this.$t('m.errorCode' + res.body.code));
      })
    },

    // 获取页面信息-银行卡
    baseInfoBankcard () {
      var url = '/api/laocai/user/bankcard?userId=' + this.userId;
      this.$http.get(url)
        .then((res) => {
          if (res.body.code == 0) {
            if (res.body.result) {
              this.baseInfoBankcardData = res.body.result

            } else {
              this.baseInfoBankcardData = []
            }
          } else {
            this.$Message.success(this.$t('m.bankInfo') + this.$t('m.qǐngqiú') + this.$t('m.errorCode' + res.body.code));
          }
        });

    },
    // 获取页面信息-电子钱包
    baseInfoEwallet () {
      if (this.orderGid) {
        var url = '/api/laocai/check/load/userBurseNo?orderGid=' + this.orderGid
        this.$http.get(url)
          .then((res) => {
            if (res.body.code == 0) {
              if (res.body.result) {
                this.Ewallet = res.body.result
              } else {
                this.Ewallet = []
              }

            } else {
              this.$Message.success(this.$t('m.diànzǐqiánbāozhànghào') + this.$t('m.qǐngqiú') + this.$t('m.errorCode' + res.body.code));
            }
          });

      }

    },
    // 获取典当类型
    dataPawnTypeQuery () {
      this.pawnType = ''
      this.$http.get('/api/laocai/pawn/info?orderGid=' + this.orderGid).then((res) => {
        if (res.data.code == 0) {
          this.pawnType = res.body.result.pawnType
        } else {
          this.$Message.success(this.$t('m.diǎndànglèixíng') + this.$t('m.qǐngqiú') + this.$t('m.errorCode' + res.body.code));
        }
      })
    },
    // 获取页面信息-用户信息
    baseInfoUser () {
      var url = '/api/laocai/user/info?userId=' + this.userId
      this.$http.get(url)
        .then((res) => {
          if (res.body.code == 0) {
            // this.$Message.success(this.$t('m.errorCode'+res.body.code));
            this.baseInfoUserData = {
              ...res.body.result.baseInfo,
              ...res.body.result.creditInfo
            }
            this.baseInfoUserData.remarkInfo = res.body.result.userMiscRess
            this.baseInfoUserData.publicIdInfos = res.body.result.publicIdInfos
          } else {
            this.$Message.success(this.$t('m.gèrénxìnxī') + this.$t('m.qǐngqiú') + this.$t('m.errorCode' + res.body.code));
          }
        });

    },

    // 获取页面信息-风控信息
    baseInfoRiskResults () {
      var url = '/api/laocai/risk/result/list?userId=' + this.userId;
      // var url = '/api/laocai/risk/result/list?userId=' + this.userId
      this.$http.get(url)
        .then((res) => {
          if (res.body.code == 0) {
            this.baseInfoRiskResultsData = res.body.result
          } else {
            this.$Message.success(this.$t('m.gèrénxìnxī') + this.$t('m.qǐngqiú') + this.$t('m.errorCode' + res.body.code));
          }
        });

    },
    // 获取页面信息-历史订单信息
    baseInfoHistorys () {
      // var url = '/api/laocai/check/application/history/list?userId=1116'
      var url = '/api/laocai/check/application/history/list?userId=' + this.userId
      this.$http.get(url)
        .then((res) => {
          if (res.body.code == 0) {
            this.baseInfoHistorysListData = res.body.result.list
          } else {
            this.$Message.success(this.$t('m.fengkongxinxi') + this.$t('m.qǐngqiú') + this.$t('m.errorCode' + res.body.code));
          }
        });

    },
    // 获取页面信息-上传照片tab
    baseInfoUpImages () {
      var url = '/api/laocai/user/miscResUrl?userId=' + this.userId;
      // var url = '/api/laocai/check/application/history/list?userId=' + this.userId
      this.$http.get(url)
        .then((res) => {
          if (res.body.code == 0) {
            this.baseInfoTabUpLoadListData = res.body.result
          } else {
            this.$Message.success(this.$t('m.fengkongxinxi') + this.$t('m.qǐngqiú') + this.$t('m.errorCode' + res.body.code));
          }
        });

    },
    // 获取页面信息-用户手机好友信息
    baseInfoPhonebook () {
      var url = '/api/laocai/user/phonebook?userId=' + this.userId
      this.$http.get(url)
        .then((res) => {
          this.baseInfoPhonebookData = res.body.result
        });
    },
    // 添加备注
    addClick () {
      this.btnLoading = true
      this.$http.post('/api/laocai/user/miscResources', {
        userId: this.userId,
        remark: this.upremark,
      }).then((res) => {
        this.btnLoading = false
        this.upremark = ''
        this.baseInfoUser()
        if (res.body.code == 0) {
        } else {
          this.$Message.success(this.$t('m.addRemark') + this.$t('m.qǐngqiú') + this.$t('m.errorCode' + res.body.code));
        }
      })
    },

    // 审批记录列表
    baseInfoApproval () {
      this.$axios({
        method: "get",
        url: "/api/laocai/check/log-list?pageSize=100&pageNumber=1&orderGid=" + this.orderGid,
        headers: {
          'x-peacock-auth': localStorage.getItem('x-peacock-auth'),
          'Content-Type': 'application/json;charset=UTF-8'
        },
        params: {},
        data: {}
      })
        .then(res => {
          // debugger
          if (res.data.code == 0) {
            if (res.data.result) {
              this.baseInfoApprovalData = res.data.result.list;
            } else {
              this.baseInfoApprovalData = []
            }
          } else {
            this.$Message.success(this.$t('m.shěnpījìlù') + this.$t('m.qǐngqiú') + this.$t('m.errorCode' + res.body.code));
          }
        })
    },
    // 催收备注日志接口
    baseInfoCollection () {
      this.$axios({
        method: "get",
        url: "/api/laocai/remind/remark/list?orderGid=" + this.orderGid,
        headers: {
          'x-peacock-auth': localStorage.getItem('x-peacock-auth'),
          'Content-Type': 'application/json;charset=UTF-8'
        },
        params: {},
        data: {}
      })
        .then(res => {
          // debugger
          if (res.data.code == 0) {
            this.baseInfoCollectionData = res.data.result;
          } else {
            this.$Message.success(this.$t('m.cuīshōurìzhì') + this.$t('m.qǐngqiú') + this.$t('m.errorCode' + res.body.code));
          }
        })
        .catch(error => {
          this.$Message.warning(this.$t('m.cuīshōurìzhì') + this.$t('m.qǐngqiúcuòwù'));
        });
    },
    // 催收用户标签
    baseInfoLabel () {
      this.$axios({
        method: "get",
        url: "/api/laocai/remind/label/user/list?userId=" + this.userId,
        headers: {
          'x-peacock-auth': localStorage.getItem('x-peacock-auth'),
          'Content-Type': 'application/json;charset=UTF-8'
        },
        params: {},
        data: {
          // userId: this.userId
        }
      })
        .then(res => {
          if (res.data.code == 0) {
            this.baseInfoLabelData = res.data.result;
          } else {
            this.$Message.success(this.$t('m.label') + this.$t('m.qǐngqiú') + this.$t('m.errorCode' + res.body.code));
          }
        })
        .catch(error => {
          this.$Message.warning(this.$t('m.label') + this.$t('m.qǐngqiúcuòwù'));
        });
    },

    // 用户图片旋转
    zhuan (x) {
      if (this.deg === 360) {
        this.deg = 0
      }
      this.deg = this.deg + 90
      document.getElementById(x).style.transform = "rotate(" + this.deg + "deg)";

    },
    magnifyImgEvent (url) {
      this.magnifyImgUri = url
    },
    noMagnifyImgEvent () {
      this.magnifyImgUri = null
    },
    magnifyImgEventgzxx (url) {
      this.magnifyImgUrigzxx = url
    },
    noMagnifyImgEventgzxx () {
      this.magnifyImgUrigzxx = null
    },

  },
  filters: {},
  computed: {},
  created () { },
  mounted () {    
    this.countryName = localStorage.getItem("x-countryName")
    this.baseInfoBankcard()
    this.baseInfoUser()
    this.baseInfoPhonebook()
    this.baseInfoHistorys()
    this.baseInfoUpImages()
    this.baseInfoRiskResults()
    this.baseInfoEwallet()
    this.baseInfoLabel()
    this.baseInfoApproval()
    this.baseInfoCollection()
    this.dataPawnTypeQuery()
    // if (this.baseType > 1) {
    // }
  },
  destroyed () { }
}
</script>

<style  lang="scss">
.two-color-num {
  transform: rotate(90deg);
}

.three-color-num {
  transform: rotate(180deg);
  transition: all 0.3s;
}

.four-color-num {
  transform: rotate(270deg);
  transition: all 0.3s;
}

.identify_person_list ul {
  margin: 0 10px;
}

.identify_person_list ul li {
  height: 35px;
  line-height: 35px;
}

.identify_photo_list_img {
  text-align: center;
}

.identify_photo_list_img span {
  font-weight: 700;
}

.identify_photo_list_img span i {
  font-weight: 700;
  cursor: pointer;
}

.pop-table h2 {
  line-height: 32px;
  font-weight: normal;
  text-align: left;
  padding: 0 10px;
}

.underline {
  font-weight: bold;
  text-decoration: underline;
  cursor: pointer;
}

.picInfoLi {
  float: left;
  width: 25%;
  margin-top: 10px;
  height: 300px;
}

.picInfoLi h3 {
  text-align: center;
  margin-bottom: 40px;
  font-size: 17px;

  font-size: 12px;
  font-family: PingFang-SC-Bold, PingFang-SC;
  font-weight: bold;
  color: rgba(34, 34, 34, 1);
}
.picInfoLi li {
  // width: 350px;
  // height: 350px;
  display: block;
  display: flex;
  margin: auto;
}

.picInfoLi a {
  // width: 350px;
  // height: 350px;
  display: block;
  display: flex;
  margin: auto;
  height: 182px;
}

.picInfoLi a span {
  margin: auto;
  width: 80%;
  display: block;
  background: #d8d8d8;
  height: 182px;
  line-height: 182px;
  text-align: center;

  font-size: 12px;
  font-family: PingFang-SC-Bold, PingFang-SC;
  font-weight: bold;
  color: rgba(34, 34, 34, 1);
}

.picInfoLi img {
  // max-height: 300px;
  width: 80%;
  height: 182px;
  margin: 40px 0px;
  background: #d8d8d8;
  display: block;
  margin: auto;
  /* overflow: hidden; */
  justify-items: center;
  align-items: center;
}

.picInfoLi p span i {
  font-weight: 700;
  transform: rotate(75deg);
  cursor: pointer;
}

.btn-wrapper {
  margin-top: 12px;
  text-align: right;
}

#paymentAllListContent {
  max-height: 330px;
  overflow: auto;
}

.btn-wrapper a:hover,
.btn-wrapper a:active,
.btn-wrapper a:visited {
  color: #ffffff;
}

.priview {
  margin-bottom: 10px;
}

.priview .priview-image {
  max-height: 60px;
}

.zhuanzhuan {
  margin-bottom: 2px;
  position: relative;
}

.myid {
  display: block;
  width: auto;
  height: 34px;
  background: #0fd0ca;
  margin-top: 15px;
  color: white;
  border-radius: 10px;
  position: relative;
}

.myid:hover {
  background: #ff936f;
}

.paymentBills_box >>> .ivu-poptip-inner {
  white-space: inherit !important;
}

.gzxxRight {
  width: 50%;
  float: left;
  padding: 50px 20px;
}

.gzxxRight li {
  width: 100%;
  height: 50px;
}

.gzxxLeft {
  width: 50%;
  float: right;
}

.gzxxLeft li {
  width: 100%;
}

.baseInfoImgBox {
  width: 80%;
  margin: auto;
  height: 33px;
  margin-top: 30px;
}

.baseInfoUploadingImg {
  width: 48%;
  float: left;
  text-align: center;
}

.baseInfoImgTitleBox {
  width: 48%;
  float: right;
  text-align: center;
  transform: scale(0.7);
}

.baseInfoImgTitleBox p {
  width: auto;
  height: 33px;
  border: 1px red solid;
  line-height: 33px;
  margin: auto;
  display: inline-block;
  padding: 0px 10px;
  border-color: #dcdee2;
  text-align: center;
  border-radius: 5px;
}

.js-identify-list ul {
  display: inline-block;
  clear: both;
  width: 100%;
  border-bottom: 0px solid #e6e6e6;
}

.baseInfoImgBoxUpload {
  width: 48%;
  float: left;
  text-align: center;
  transform: scale(0.7);
}

.baseInfo_box {
  margin: 8px;
}
.baseInfo_box_item {
}
.baseInfo_box_item_box {
  padding: 15px 13px;
  overflow: hidden;
  margin: 10px 0;
  background: rgba(249, 249, 249, 1);
  h4 {
    font-size: 16px;
    font-family: PingFang-SC-Heavy, PingFang-SC;
    font-weight: 800;
    color: rgba(34, 34, 34, 1);
    line-height: 10px;
    height: 20px;
    padding-left: 8px;
    display: inline-block;
    margin-bottom: 20px;
    background: linear-gradient(
      to right,
      #2d8cf0 0%,
      #2d8cf0 3px,
      #f9f9f9 3px,
      #f9f9f9 100%
    );
  }
  .first {
    height: 34px;
    background: #2d8cf0;
    font-size: 15px;
    font-family: PingFang-SC-Bold, PingFang-SC;
    font-weight: bold;
    color: #fff;
    line-height: 11px;
    display: inline-block;
    line-height: 18px;
    padding: 7px 20px;
    transform: scale(0.7);
    margin-left: -10px;
    border-radius: 3px 15px 3px 3px;
  }
  .first:after {
    content: "";
    width: 0;
    height: 0;
    border-bottom: 10px solid rgba(195, 224, 255, 1);
    border-right: 10px solid transparent;
    position: absolute;
    top: -1px;
    right: 0px;
  }
  .Level {
    height: 34px;
    background: rgba(239, 173, 32, 1);
    font-size: 15px;
    font-family: PingFang-SC-Bold, PingFang-SC;
    font-weight: bold;
    color: #fff;
    line-height: 11px;
    display: inline-block;
    line-height: 18px;
    padding: 7px 20px;
    transform: scale(0.7);
    margin-left: -10px;
    border-radius: 3px 15px 3px 3px;
  }
  .Level:after {
    content: "";
    width: 0;
    height: 0;
    border-bottom: 10px solid rgba(255, 237, 198, 1);
    border-right: 10px solid transparent;
    position: absolute;
    top: -1px;
    right: 0px;
  }
  li {
    font-size: 12px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #222222;
    overflow: hidden;    
    text-overflow: inherit;
    white-space: nowrap;
      span{
        margin-left: 10px;
      }
  }
  .baseInfo_box_item_box_centre {
    width: 100%;
    clear: both;
    min-height: 50px;
    border-top: 1px #e3e3e3 solid;
    border-bottom: 1px #e3e3e3 solid;
    li {
      min-height: 50px;
      line-height: 50px;
    }
  }
  .baseInfo_box_item_box_border {
    width: 100%;
    height: 1px;
    clear: both;
    border-bottom: 1px #e3e3e3 solid;
  }
  span {
    color: #999999;
  }
  .picInfoLi {
    width: 25%;
  }
  .baseInfo_box_item_top {
    margin-bottom: 25px;
    span {
      font-size: 16px;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: #222222;
    }
    i {
      margin-right: 100px;
      font-size: 16px;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: #2d8cf0;
    }
  }
  .baseInfo_box_item_risk {
    margin-bottom: 15px;
    em {
      width: 100%;
      height: 30px;

      display: block;
      border-bottom: 2px #999999 dotted;
    }
    .risk_title {
      float: left;
      font-size: 12px;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: #222;
      display: inline-block;
      height: 30px;
      padding: 0px;
      padding-right: 20px;
      background: rgba(249, 249, 249, 1);
      line-height: 30px;
      margin-top: -17px;
    }
    span {
      float: right;
      padding-left: 20px;
      height: 31px;
      margin-top: -11px;
      width: 200px;
      background: rgba(249, 249, 249, 1);
      i {
        width: 200px;
        text-align: center;
        height: 30px;
        line-height: 30px;
        padding: 0 20px;
        margin-top: -16px;
        background: #c9c9c9;
        border-radius: 3px;
        display: inline-block;
        font-size: 13px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: rgba(255, 255, 255, 1);
      }
      .risk_type1 {
        background: red;
      }
      .risk_type2 {
        background: #dc5c5c;
      }
      .risk_type3 {
        background: #ee8825;
      }
      .risk_type4 {
        background: #f1c51c;
      }
      .risk_type5 {
        background: #2baae6;
      }
      .risk_type6 {
        background: #2d8cf0;
      }
      .risk_type7 {
        background: #c9c9c9;
      }
      .risk_type8 {
        background: #dc5c5c;
      }
    }
  }
  .baseInfo_box_item_box_upLoad_button {
    font-size: 14px;
    margin-bottom: 20px;
    span {
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: rgba(34, 34, 34, 1);
    }
  }
}
.baseInfo_box_title {
}
</style>
